<template>
    <div class="master-content" @click="toMasterDetail">
        <div class="master-title">
            <p>{{data.realname}}</p>
            <p>{{data.actcate_name}} 专业大师</p>
        </div>
        <van-image :src="'/uploads'+data.thumb" fit="cover"></van-image>
    </div>
</template>
<script>
export default {
  name: 'masterCard',
  props: {
    data: Object
  },
  methods: {
    toMasterDetail () {
      this.$root.$router.push({
        path: '/masterdetail',
        query: {
          id: this.data.id
        }
      })
    }
  }
}
</script>
<style scoped>
.master-content{
    padding: 1rem;
    border-bottom: 1px solid rgb(221, 217, 217);
    margin-top: 20px;
}
.master-title{
    height: 3rem;
}
.master-title>p:first-of-type{
    font-size: 1.2rem;
    font-weight: 600;
    height: 3rem;
    line-height: 3rem;
    width: 50%;
    float: left;
}
.master-title>:last-of-type{
    height: 3rem;
    line-height: 3.5rem;
    width: 50%;
    float: left;
    text-align: right;
    color: #999;
}
.master-content>.van-image{
    width: 100%;
    height: 15rem;
}
</style>
